<template>
    <div class="app-container">
        <div class="filter-container">
            <article>
              <el-table border :data="dataList">
                <el-table-column prop="createTime" label="提现申请时间" align="center" width="180px" >
                </el-table-column>
                <el-table-column prop="id" label="S用户ID" align="center" min-width="200px">
                </el-table-column>
                <el-table-column prop="bankName" label="银行名称" align="center" min-width="200px">
                </el-table-column>
                <el-table-column prop="userName" label="银行账户名" align="center" min-width="200px">
                </el-table-column>
                <el-table-column prop="bankNo" label="银行账号" align="center" width="150px" >
                </el-table-column>
                <el-table-column prop="telNo" label="手机号" align="center" min-width="200px">
                </el-table-column>
                <el-table-column prop="email" label="Email" align="center" min-width="200px">
                </el-table-column>
                <el-table-column label="提现积分" align="center" min-width="200px">
                  <template slot-scope="scope">
                    {{scope.row.cashAmount|divideFilter}}
                  </template>
                </el-table-column>
                <el-table-column label="提现手续费" align="center" min-width="200px">
                  <template slot-scope="scope">
                    {{scope.row.fee|divideFilter}}
                  </template>
                </el-table-column>
                <el-table-column label="到账积分" align="center" min-width="200px">
                  <template slot-scope="scope">
                    {{scope.row.cashAccountAmount|divideFilter}}
                  </template>
                </el-table-column>
                <el-table-column prop="cashStatus" label="状态" align="center" min-width="200px">
                </el-table-column>
                <el-table-column fixed="right" label="操作" align="center" width="200px">
                  <template slot-scope="scope">
                    <el-button plain type="primary" size="mini" @click="toDditProduct(scope.row)" v-if="scope.row.cashStatus==='待提现'">提现</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <list-pagination :total="total" :page="page" :pageSize="pageSize" :handleSizeChange="handleSizeChange" :handleCurrentChange="handleCurrentChange"></list-pagination>
            </article>
            <el-dialog
                title="提示"
                :visible.sync="dialogVisible"
                width="400px"
                :before-close="handleClose">
                <div class="editGoodsGounp">
                  是否提现?
                </div>
                <span slot="footer" class="dialog-footer">
                    <el-button size="small" type="info" @click="makeFail">提现失败</el-button>
                    <el-button size="small" type="primary" @click="makeSure">提现成功</el-button>
                </span>
            </el-dialog>
        </div>
    </div>
</template>
<script>
import list from '@/mixins/List'
import listPagination from '@/components/ListPagination'
import {
  cashOutRecordPage, doSureCashOut
} from '@/api/adminOperation'
export default {
  name: 'screenAdList',
  mixins: [list],
  data () {
    return {
      dataList: [],
      dialogVisible: false,
      id: '',
      status: '',
      screenlist: {}
    }
  },
  components: {
    listPagination
  },
  watch: {

  },
  mounted () {
    console.log(this.$route.query.mobiles)
    if (this.$route.query.mobiles === undefined) {
      this.screenlist = {
        pageNum: this.page,
        pageSize: this.pageSize
      }
      this.getList()
    } else {
      this.screenlist = {
        telNo: this.$route.query.mobiles,
        pageNum: this.page,
        pageSize: this.pageSize
      }
      console.log(this.screenlist)
      this.getList()
    }
  },
  methods: {
    async getList () { // 列表
      let { data } = await cashOutRecordPage(this.screenlist)
      this.dataList = data.list
      for (let item of this.dataList) {
        let status = ['待提现', '提现成功', '提现失败']
        item.cashStatus = status[item.cashStatus]
      }
      this.total = this.dataList.length
    },
    toDditProduct (row) {
      this.id = row.id
      // this.status = row.cashStatus
      // if (this.status === '待提现') {
      //   this.status = 0
      // } else if (this.status === '提现成功') {
      //   this.status = 1
      // } else {
      //   this.status = 2
      // }
      this.dialogVisible = true
    },
    makeFail () {
      doSureCashOut({ 'id': this.id, 'status': 2 }).then(res => {
        if (res.code === 200) {
          this.getList()
          this.dialogVisible = false
          this.$message.success('操作成功')
        } else {
          this.getList()
          this.dialogVisible = false
          this.$message.success('操作失败')
        }
      })
    },
    makeSure () {
      doSureCashOut({ 'id': this.id, 'status': 1 }).then(res => {
        if (res.code === 200) {
          this.getList()
          this.dialogVisible = false
          this.$message.success('操作成功')
        } else {
          this.getList()
          this.dialogVisible = false
          this.$message.success('操作失败')
        }
      })
    },
    handleClose () {
      this.dialogVisible = false
    }
  }
}
</script>
<style lang="scss" scoped>
    .editGoodsGounp {
      width: 100%;
      height: 100px;
      line-height:60px;
      text-align: center;
      font-size: 18px;
      font-weight: 500;
      text-align: center;
      padding: 20px 0;

    }
</style>
